<template>
	<view class="payment">
		<uni-card>
			<view class="u_card">
				<image
					src="https://img2.baidu.com/it/u=2592595168,3538142611&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=500"
					mode="" class="un_img"></image>
				<view class="right_ft">
					<view class="name">
						陈小满 <image :src="sd" mode="" class="sudao"></image>
					</view>
					<view class="content">
						事业感情未来可期
					</view>
				</view>
			</view>
			<view class="u_ft">
				<view class="u_ft_left">
					语音文字咨询每分钟消耗
				</view>
				<view class="u_ft_right">
					<image :src="tabi" mode="" class="tabiimg"></image> 3.36
				</view>
			</view>
		</uni-card>
		<view class="kaquan">
			<view class="">
				<image :src="kaquanicon" mode="" class="kaquan_img"></image> <text class="kaquan_ft">卡券</text>
			</view>
			<view class="">
				<text class="nokaquan">暂无可使用卡券</text><uni-icons custom-prefix="right" type="right"
					style="vertical-align: middle;" color="#B9B9BD" size="20"></uni-icons>
			</view>
		</view>
		<uni-card>
			<view class="xuzhi">
				咨询须知
			</view>
			<view class="zx_content"  v-for="(item,index) in contentlist" :key='index'>
				{{index+1}}.<rich-text :nodes="item.content"></rich-text>
				
			</view>
		</uni-card>
		<view class="footer"><button class="footer_btn">开启咨询</button></view>

	</view>
</template>

<script>
	import {
		imgBaseUrl
	} from '@/utils/baseUrl.js'
	export default {
		data() {
			return {
				contentlist: [{
						id: '1',
						content: '一对一咨询内容仅您与服务人员可收听。'
					}, {
						id: '1',
						content: '需要确认自己是成年人。'
					},
					{
						id: '1',
						content: '需要确认自己无精神疾病和自杀倾向，如有请立即就医。'
					},
					{
						id: '1',
						content: '需知悉当前咨询服务不具备诊断与治疗功能，不具备医学指导意义。'
					},
					{
						id: '1',
						content: '需知悉任何人的任何建议或言论，仅供参考，请谨慎判断。'
					},
					{
						id: '1',
						content: '需知悉达人言论是基于自身知识储备和个人生活经验所得，对特定内容进行二次分析或内容演绎时，会存在较明显的个体差异，不具备显示决策意义，平台对达人关乎未来的言论不做任何承担或担保，请理性消费。'
					},
					{
						id: '1',
						content: '账户内月须满足 <strong style="color:#FF7F22"> 5分钟 </strong>连麦消耗，否则将无法连麦。'
					},
					{
						id: '1',
						content: '发起一对一咨询时请耐心等待，如 <strong style="color:#FF7F22"> 60秒 </strong> 未接通将自行挂断。'
					}
				],
				tabi: imgBaseUrl + '/img/wshing/tab.png',
				kaquanicon: imgBaseUrl + '/img/wshing/kaquanicon.png',
				sd: imgBaseUrl + '/img/wshing/shudao.png',
			}
		},
		onLoad() {
		},
		methods: {

		}
	}
</script>

<style lang="less" scoped>
	.payment {
		width: 100%;
		// height: 100vh;
		background: #F5F5F5;
		overflow: hidden;
		display: flex;
		flex-direction: column;
		justify-content: space-between;

		.u_card {
			display: flex;
			align-items: center;

			.un_img {
				width: 104rpx;
				height: 104rpx;
				border-radius: 50%;
				opacity: 1;
			}

			.right_ft {
				margin-left: 20rpx;

				.name {
					font-size: 32rpx;
					font-family: PingFang SC-Bold, PingFang SC;
					font-weight: bold;
					color: #333333;

					.sudao {
						width: 130rpx;
						height: 45rpx;
						vertical-align: middle;
						margin-left: 20rpx;
					}

				}

				.content {
					font-size: 24rpx;
					font-family: PingFang SC-Regular, PingFang SC;
					font-weight: 400;
					color: #666666;
				}
			}
		}

		.u_ft {
			display: flex;
			justify-content: space-between;
			padding-top: 40rpx;
			padding-bottom: 14rpx;

			.u_ft_left {
				font-size: 30rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 500;
				color: #333333;
			}

			.u_ft_right {
				font-size: 30rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 500;
				color: #333333;

				.tabiimg {
					width: 36rpx;
					height: 36rpx;
					vertical-align: middle;
				}
			}
		}

		.kaquan {
			height: 73rpx;
			margin-left: 28rpx;
			margin-right: 32rpx;
			box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.08);
			background-color: #fff;
			padding: 32rpx 20rpx 20rpx 34rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;

			.kaquan_img {
				width: 32rpx;
				height: 32rpx;
				vertical-align: middle;
			}

			.kaquan_ft {
				font-size: 30rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 500;
				color: #333333;
				margin-left: 20rpx;
			}

			.nokaquan {
				font-size: 30rpx;
				font-family: PingFang SC-Regular, PingFang SC;
				font-weight: 400;
				color: #B9B9BD;
			}
		}

		.xuzhi {
			font-size: 36rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 500;
			color: #222229;
			padding-bottom: 20rpx;
		}

		.zx_content {
			margin-top: 20rpx;
			font-size: 26rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 500;
			color: #666666;
			display: flex;
		}

		.footer {
			margin-left: 28rpx;
			margin-right: 32rpx;
		}

		.footer_btn {
			background: #FF7F22;
			color: #FFFFFF;
			height: 88rpx;
			line-height: 88rpx;
			margin-top: 20rpx;
		}
	}
</style>